<template>
  <!--付款计划(应付)视图-->
  <div style="background-color: #E9EEF3;">
    <el-row>
      <el-col :span="20" :offset="2" style="color: #333333;margin-bottom: 20px;margin-top: 20px;">
        <el-row class="m-b-10">
          <el-col :offset="2" :span="4">
            <div style="line-height: 56px;font-size: 18px;width:200px">审批过程：</div>
          </el-col>
          <!--同意显示同意-->
          <el-col v-if="this.paymentPlan.paymentPlanAppStatus !== 3" :span="18">
            <el-steps :active="active" finish-status="success" space="20%">
              <el-step title="待申请"></el-step>
              <el-step title="待审批"></el-step>
              <el-step title="同意"></el-step>
              <el-step title="执行"></el-step>
            </el-steps>
          </el-col>
          <!--否决显示否决-->
          <el-col v-if="this.paymentPlan.paymentPlanAppStatus === 3" :span="18">
            <el-steps :active="active" finish-status="success" space="20%">
              <el-step title="待申请"></el-step>
              <el-step title="待审批"></el-step>
              <el-step title="否决"></el-step>
              <el-step title="执行"></el-step>
            </el-steps>
          </el-col>
        </el-row>
        <el-row class="m-b-10">
          <el-row v-if="this.paymentPlan.paymentPlanAppStatus === 0">
            <el-col  :offset="8" :span="4" >
              <div class="opera" @click="findAllEmp(currPage,pageSize)">
                <div style="line-height: 30px;"><i class="el-icon-position"/></div>
                <span class="font-14">申请审批</span>
              </div>
            </el-col>
            <el-col  :span="4" >
              <div class="opera-no">
                <div style="line-height: 30px;"><i class="el-icon-d-arrow-left"/></div>
                <span class="font-14">撤销审批</span>
              </div>
            </el-col>
          </el-row>
          <el-row v-if="this.paymentPlan.paymentPlanAppStatus === 1">
            <el-col  :offset="8" :span="4" >
              <div class="opera-no">
                <div style="line-height: 30px;"><i class="el-icon-position"/></div>
                <span class="font-14">申请审批</span>
              </div>
            </el-col>
            <el-col  :span="4" >
              <div class="opera" @click="repealApp">
                <div style="line-height: 30px;"><i class="el-icon-d-arrow-left"/></div>
                <span class="font-14">撤销审批</span>
              </div>
            </el-col>
          </el-row>
          <el-row v-if="this.paymentPlan.paymentPlanAppStatus === 3">
            <el-col  :offset="8" :span="4" >
              <div class="opera" @click="findAllEmp(currPage,pageSize)">
                <div style="line-height: 30px;"><i class="el-icon-position"/></div>
                <span class="font-14">申请审批</span>
              </div>
            </el-col>
            <el-col  :span="4" >
              <div class="opera-no">
                <div style="line-height: 30px;"><i class="el-icon-d-arrow-left"/></div>
                <span class="font-14">撤销审批</span>
              </div>
            </el-col>
          </el-row>
          <!-- 员工表格dialog-->
          <el-dialog width="30%" title="申请审批" :visible.sync="innerDialog">
            <div style="margin-bottom: 20px"><span class="font-14-bold">说明：</span>以下人员拥有审批权限</div>
            <el-table :data="empList" style="width: 100%">
              <el-table-column prop="job.jobName" label="员工职位" >
              </el-table-column>
              <el-table-column prop="empName" label="员工姓名" >
              </el-table-column>
            </el-table>
            <el-row style="margin-top:10px">
              <el-col :span="16">
                <el-pagination layout="prev, pager, next, jumper" :total="totalSize" @current-change="changePage"
                               :current-page.sync="currPage" :page-size="pageSize"></el-pagination>
              </el-col>
            </el-row>
            <div style="margin-top: 20px;text-align: center">
              <el-button @click="saveApproval">申请审批</el-button>
            </div>
            <!--<el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
              <el-checkbox v-for="emp in empList" :label="emp.empName" :key="emp.empName">{{emp.empName}}</el-checkbox>
            </el-checkbox-group>-->
          </el-dialog>
        </el-row>
        <el-row class="b-g-f p-10-20 border-style">
          <el-row>
            <el-col :span="24">
              <div class="dialog__header">
                <span class="dialog__title">付款计划(应付)</span>
              </div>
            </el-col>
          </el-row>
          <el-form :model="paymentPlan" ref="payPlan" label-width="100px" :rules="rules">
            <el-row>
              <el-col>
                <el-form-item label="供应商/客户:" prop="customerByCustomerId.customerName">
                  <el-input :disabled="true" v-model="paymentPlan.customerByCustomerId.customerName"  style="width: 91%"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="计划付款日期:">
                  <el-date-picker v-model="paymentPlan.paymentPlanDate" type="date" placeholder="选择日期" style="width: 79%"></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="期次:" prop="paymentPlanPeriods">
                  <el-select v-model="paymentPlan.paymentPlanPeriods" placeholder="未选"  style="width: 79%">
                    <el-option v-for="item in qcOptions" :key="item.value" :label="item.label" :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="金额:" prop="paymentPlanAmount">
                  <el-input v-model.number="paymentPlan.paymentPlanAmount" style="width: 79%"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="负责人:" prop="employeeByEmpId.empName">
                  <el-input :disabled="true" v-model="paymentPlan.employeeByEmpId.empName" style="width: 79%" >
                    <el-button @click="openEmpDialog" slot="append" icon="el-icon-search" ></el-button>
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="采购单:">
                  <el-input :disabled="true" v-model="paymentPlan.purchaseByPurchaseId.purchaseTheme" style="width: 79%"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="状态:" >
                  <el-select :disabled="true" v-model="paymentPlan.paymentPlanStatus" placeholder="未选" style="width: 79%">
                    <el-option
                      v-for="item in ztOptions" :key="item.value" :label="item.label" :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="备注:">
                  <el-input v-model="paymentPlan.paymentPlanNote" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入内容"  style="width: 91%"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="审批状态:" style="width: 91%">
                  <div v-if="this.paymentPlan.paymentPlanId !== 0">
                    <div v-if="this.paymentPlan.paymentPlanAppStatus === 0">
                      <span>待申请</span>
                      <el-tooltip class="item" effect="dark" content="待申请" placement="bottom">
                        <i class="el-icon-more font-18"></i>
                      </el-tooltip>
                    </div>
                    <div v-if="this.paymentPlan.paymentPlanAppStatus === 1">
                      <span>待审批</span>
                      <el-tooltip class="item" effect="dark" content="待审批" placement="bottom">
                        <i class="el-icon-s-opportunity font-18"></i>
                      </el-tooltip>
                    </div>
                    <div v-if="this.paymentPlan.paymentPlanAppStatus === 2">
                      <span>同意</span>
                      <el-tooltip class="item" effect="dark" content="同意" placement="bottom">
                        <i class="el-icon-circle-check font-18"></i>
                      </el-tooltip>
                      <span>审批人：{{paymentPlan.employeeByEmpId.empName}}</span>
                    </div>
                    <div v-if="this.paymentPlan.paymentPlanAppStatus === 3">
                      <span>否决</span>
                      <el-tooltip class="item" effect="dark" content="否决" placement="bottom">
                        <i class="el-icon-circle-close font-18"></i>
                      </el-tooltip>
                      <span>审批人：{{paymentPlan.employeeByEmpId.empName}}</span>
                    </div>
                  </div>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="审批记录:" style="width: 91%">
                  <el-row></el-row>
                  <el-row :key="index" v-for="(app,index) in approvalRecordList">
                    <div class="border-bo" >
                      <div class="font-13-bold">
                        <span>申请：</span>
                        <span class="margin-r-3">{{app.employeeByApplicantEmpId.empName}}<i class="el-icon-right"/> boss用户</span>
                        <span>{{app.approvalRecordDate | formatDateJudge}}</span>
                      </div>
                      <div class="font-13" v-if="app.employeeByApprovalEmpId !== null">
                        <span class="margin-r-3"><i class="el-icon-minus"/>{{app.employeeByApprovalEmpId.empName}}</span>
                        <span class="margin-r-3">{{app.approvalRecordTime | formatDate}}</span>
                        <span class="margin-r-3">{{app.approvalRecordOper}}</span>
                        <span>备注：{{app.approvalRecordNote}}</span>
                      </div>
                    </div>
                  </el-row>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12" :offset="6">
                <el-form-item>
                <span v-if="this.paymentPlan.paymentPlanAppStatus !== 2">
                  <el-button @click="addPaymentPlan" type="primary">保存</el-button>
                  <el-button @click="handleDelete" type="danger">删除</el-button>
                </span>
                  <span v-if="this.paymentPlan.paymentPlanStatus !== 2 && this.paymentPlan.paymentPlanAppStatus === 2">
                    <el-button @click="clickCreatePayRecords" type="primary"><i class="el-icon-bottom margin-r-3"/>生成付款记录</el-button>
                  </span>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <!--内层dialog员工-->
          <el-dialog width="30%" title="人员选择" :visible.sync="innerDialogEmp" append-to-body
                     @close="closeInnerDialogEmp">
            <div>
              <el-collapse v-model="activeName">
                <el-collapse-item v-for ="(dept,index) in deptList" :title="dept.deptName" :key="index" :name="dept.deptId">
                  <ul class="emp-ul">
                    <li @click="choiceEmp(emp)" v-for="(emp,index) in dept.employeeByDeptId">
                      <span v-if="index !== dept.employeeByDeptId.length-1" class="line-style"></span>
                      <span v-if="index === dept.employeeByDeptId.length-1" class="line-style-end"></span>
                      <span class="">{{emp.empName}}</span>
                    </li>
                  </ul>
                </el-collapse-item>
              </el-collapse>
            </div>
          </el-dialog>
          <!--付款记录dialog-->
          <el-dialog title="付款记录" :visible.sync="dialogPay" width="60%" style="color: #333333"
                     @close="closeDialogPayRecords">
            <el-form :model="paymentRecords" ref="payRecords" label-width="100px" :rules="payRecordsRules">
              <hr style="margin-bottom: 15px">
              <el-row>
                <el-col>
                  <el-form-item label="采购单:">
                    <el-input :disabled="true" v-model="paymentRecords.purchaseByPurchaseId.purchaseTheme" style="width: 91%"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="期次:">
                    <el-select :disabled="true" v-model="paymentRecords.paymentRecordsPeriods" placeholder="未选"  style="width: 79%">
                      <el-option v-for="item in qcOptions" :key="item.value" :label="item.label" :value="item.value">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="付款日期:" prop="paymentRecordsDate">
                    <el-date-picker v-model="paymentRecords.paymentRecordsDate" type="date" placeholder="选择日期" style="width: 79%"></el-date-picker>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="金额:">
                    <el-input :disabled="true" v-model="paymentRecords.paymentRecordsAmount" style="width: 79%"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="付款方式:" prop="paymentRecordsPayStyle">
                    <el-select v-model="paymentRecords.paymentRecordsPayStyle" placeholder="未选"  style="width: 79%">
                      <el-option v-for="item in payRecordsFsOptions" :key="item.value" :label="item.label" :value="item.value">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="是否收票:">
                    <el-radio-group v-model="paymentRecords.paymentRecordsWhetherTicket">
                      <el-radio :label="1">未收</el-radio>
                      <el-radio :label="2">已收</el-radio>
                      <el-radio :label="3">无需发票</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="客户:">
                    <el-input :disabled="true" v-model="paymentRecords.customerByCustomerId.customerName" style="width: 79%"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="对应对货单:" >
                    <el-input :disabled="true" style="width: 79%"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="经手人:">
                    <el-input :disabled="true" v-model="paymentRecords.employeeByEmpId.empName" style="width: 79%"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="分类:" >
                    <el-select v-model="paymentRecords.paymentRecordsClassify" placeholder="未选"  style="width: 79%">
                      <el-option v-for="item in payRecordsClaOptions" :key="item.value" :label="item.label" :value="item.value">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="备注:">
                    <el-input v-model="paymentRecords.paymentRecordsNote" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入内容" style="width: 91%"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12" :offset="6">
                  <el-form-item>
                    <el-button @click="addPayRecords" type="primary">保存</el-button>
                    <el-button @click="dialogPay = false">取消</el-button>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
          </el-dialog>
        </el-row>
      </el-col>
    </el-row>
  </div>
</template>

<script>
  import {formatTimeToStr} from '../assets/format.js'
  export default {
  data () {
    return {
      dialogPay:false,
      emp:{},
      pageSize: 5, // 分页页大小
      currPage: 1, // 当前页码，默认为1
      totalSize: 0, // 总记录数
      purchase: {
        purchaseId: 0,
        purchaseTheme: '',
        purchaseNo: '',
        purchaseDate: '',
        purchasePredictDate: '',
        purchaseStatus: '',
        purchaseSort: '',
        purchaseAmount: '',
        purchaseNote: '',
        purchaseContactName: '',
        purchaseBill: 0,
        purchasePaid: 0,
        purchaseAppStatus: 0,
        purchaseReturn: 1,
        customerByCustomerId: '',
        employeeByEmpId: '',
        customerByConCustomerId:null,
        contractByContractId:null,
        employeeByAppEmpId:null,
        warehouseByWarehouseId:null
      },
      detailList:[],
      paymentPlan:{
        paymentPlanId:0,
        paymentPlanAmount:'',
        paymentPlanDate:'',
        paymentPlanPeriods:'',
        paymentPlanStatus:'',
        paymentPlanNote:'',
        paymentPlanAppStatus:0,
        customerByCustomerId:'',
        employeeByEmpId:'',
        purchaseByPurchaseId:'',
        employeeByAppEmpId:null
      },
      empList:[],// 所有Boss用户
      innerDialog: false,// bossDialog
      innerDialogEmp: false,// 内层dialog员工
      activeName: [],
      deptList:[],
      active: 0, //审批步骤初始值
      // 撤销审批对象
      approval:{
        approvalId:0,
        approvalTheme:'',
        approvalStay:'',
        approvalStatus: '',
        approvalClassify:'',
        approvalOperation:'',
        approvalContent:'',
        approvalDate:'',
        approvalTime:'',
        paymentPlanByPaymentPlanId:'',
        employeeByApplicantEmpId:'',
        employeeByApprovalEmpId:null
      },
      approvalRecordList:[],// 审批记录集合
      // 审批记录
      approvalRecord:{
        approvalRecordId:0,
        approvalRecordTime:'',
        approvalRecordOper:'',
        approvalRecordNote:'',
        approvalRecordDate:'',
        paymentPlanByPaymentPlanId:'',
        employeeByApplicantEmpId:'',
        employeeByApprovalEmpId:null
      },
      rules: {
        paymentPlanAmount: [
          { required: true, message: '必须填'},
          { type: 'number', message: '必须为数字'}
        ],
        paymentPlanPeriods: [
          { required: true, message: '必须填', trigger: 'blur' }
        ],
        'customerByCustomerId.customerName': [
          { required: true, message: '请选择客户', trigger: 'blur' }
        ],
        'employeeByEmpId.empName': [
          { required: true, message: '请选择负责人', trigger: 'blur' }
        ]
      },
      qcOptions: [{
        value: 1,
        label: '1'
      }, {
        value: 2,
        label: '2'
      }, {
        value: 3,
        label: '3'
      }, {
        value: 4,
        label: '4'
      }, {
        value: 5,
        label: '5'
      }, {
        value: 6,
        label: '6'
      },{
        value: 7,
        label: '7'
      }, {
        value: 8,
        label: '8'
      }, {
        value: 9,
        label: '9'
      }, {
        value: 10,
        label: '10'
      }, {
        value: 11,
        label: '11'
      }, {
        value: 12,
        label: '12'
      }],
      ztOptions: [{
        value: 1,
        label: '未付'
      }, {
        value: 2,
        label: '已付'
      }, {
        value: 3,
        label: '不提醒'
      }],
      paymentRecords:{
        paymentRecordsId:0,
        paymentRecordsPeriods:'',
        paymentRecordsDate:'',
        paymentRecordsAmount:'',
        paymentRecordsPayStyle:'',
        paymentRecordsWhetherTicket:'',
        paymentRecordsClassify:'',
        paymentRecordsNote:'',
        employeeByEmpId:'',
        customerByCustomerId:'',
        purchaseByPurchaseId:'',
        paymentPlanByPaymentPlanId:'',
        returnByReturnId:null
      },
      payRecordsRules: {
        paymentRecordsDate: [
          { required: true, message: '必须填', trigger: 'blur' }
        ],
        paymentRecordsPayStyle: [
          { required: true, message: '必须填', trigger: 'blur' }
        ]
      },
      payRecordsFsOptions: [{
        value: 1,
        label: '支票'
      }, {
        value: 2,
        label: '现金'
      }, {
        value: 3,
        label: '邮政付款'
      },{
        value: 4,
        label: '电汇'
      }, {
        value: 5,
        label: '网上银行'
      },{
        value: 6,
        label: '其他'
      }],
      payRecordsClaOptions: [{
        value: 1,
        label: '购货款'
      }, {
        value: 2,
        label: '转账'
      }, {
        value: 3,
        label: '抵债付款'
      }],
    }
  },
  methods: {
    // 查询当前员工
    loginEmp(){
      this.$axios.get('http://localhost:8088/emp')
        .then(v => {
          this.emp = v.data
        })
        .catch(function (v) {})
    },
    // 查询付款计划
    initData () {
      let payId = this.$route.query.payId
      this.$axios.get('http://localhost:8088/pay-plan',{
        params:{
          payId: payId
        }
      })
        .then(v => {
          this.paymentPlan = v.data
          if(this.paymentPlan.paymentPlanAppStatus === 0){
            this.active = 0
          }else if (this.paymentPlan.paymentPlanAppStatus === 1){
            this.active = 1
          }else if (this.paymentPlan.paymentPlanAppStatus === 2){
            this.active = 2
          }else if (this.paymentPlan.paymentPlanAppStatus === 3){
            this.active = 2
          }
          this.findPurchase(this.paymentPlan.purchaseByPurchaseId.purchaseId)
          this.findDetail(this.paymentPlan.purchaseByPurchaseId.purchaseId)
        })
        .catch(function (v) {})
    },
    // 查询所有采购
    findPurchase(purId) {
      this.$axios.get('http://localhost:8088/pur-id', {
        params: {
          purId : purId
        }
      })
        .then(v => {
          this.purchase = v.data
        })
        .catch(function (v) {})
    },
    // 查询所有详单
    findDetail(purId){
      this.$axios.get('http://localhost:8088/pur-detail-list', {
        params:{
          purId : purId
        }
      })
        .then(v => {
          this.detailList = v.data
        })
        .catch(function (v) {})
    },
    // 新增、修改
    addPaymentPlan() {
      this.$refs.payPlan.validate((valid) => {
        if (valid) {
          this.$axios.post('http://localhost:8088/save-pay-plan',this.paymentPlan)
            .then(v => {
              this.initData(this.currPage, this.pageSize,this.allValue)
              this.initData()
              this.findApproval()
              this.findAppRecord()
              this.findAppRecordBy()
              this.$message({
                message: '已保存',
                type: 'success'
              });
            })
            .catch(function (v) {
            })
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    // 查询付款计划待审批表
    findApproval(){
      let payId = this.$route.query.payId
      this.$axios.get('http://localhost:8088/app-pay', {
        params:{
          payId : payId
        }
      })
        .then(v => {
          if (v.data.length !== 0 ){
            this.approval = v.data
          }
        })
        .catch(function (v) {})
    },
    // 查询付款计划处于待审批审批记录表
    findAppRecordBy(){
      let payId = this.$route.query.payId
      this.$axios.get('http://localhost:8088/app-record-pay-app', {
        params:{
          payId : payId
        }
      })
        .then(v => {
          if (v.data.length !== 0 ){
            this.approvalRecord = v.data
          }
        })
        .catch(function (v) {})
    },
    // 查询付款计划单审批记录集合
    findAppRecord(){
      let payId = this.$route.query.payId
      this.$axios.get('http://localhost:8088/app-record-pay-list', {
        params:{
          payId : payId
        }
      })
        .then(v => {
          this.approvalRecordList = v.data
        })
        .catch(function (v) {})
    },
    // 查询所有boss
    findAllEmp(currPage,pageSize){
      this.innerDialog = true
      this.$axios.get('http://localhost:8088/emp-boss-list',{params: {
          page: currPage,
          size: pageSize,
        }
      })
        .then(v => {
          this.empList = v.data.rows
          this.totalSize = v.data.total
        })
        .catch(function (v) {})
    },
    //boss分页
    changePage (val) {
      // val就是当前页码
      this.findAllEmp(val, this.pageSize)
    },
    //查询部门员工
    findDeptList () {
      this.$axios.get('http://localhost:8088/dept-emp-list')
        .then(v => {
          this.deptList = v.data
          for(let i = 1;i <= this.deptList.length;i++){
            this.activeName.push(i)
          }
        })
        .catch(function (v) {})
    },
    //打开员工dialog
    openEmpDialog(){
      this.innerDialogEmp = true
      this.findDeptList()
    },
    // 选择员工
    choiceEmp(val) {
      this.paymentPlan.employeeByEmpId = val
      this.innerDialogEmp = false;
    },
    //关闭员工diglog事件
    closeInnerDialogEmp(){
      this.activeName = []
    },
    // 申请审批
    saveApproval(){
      //新增审批记录表
      this.approvalRecord.employeeByApplicantEmpId = this.emp
      this.approvalRecord.approvalRecordDate = this.addDate()
      this.approvalRecord.paymentPlanByPaymentPlanId = this.paymentPlan
      this.saveAppRecord()
      //新增审批表 审批状态1 1待审批 2同意 3否决 4撤销
      this.approval.approvalTheme = this.paymentPlan.purchaseByPurchaseId.purchaseTheme+'付款计划'
      this.approval.approvalContent = '付款计划'
      this.approval.approvalStatus = 1
      this.approval.approvalDate = this.addDate()
      this.approval.approvalClassify = 5
      this.approval.employeeByApplicantEmpId = this.emp
      this.approval.paymentPlanByPaymentPlanId = this.paymentPlan
      this.saveApp()
      this.$message({
        message: '申请成功',
        type: 'success'
      })
      //修改出差 审批状态为待审批 0待申请 1待审批 2同意 3否决
      this.paymentPlan.paymentPlanAppStatus = 1
      this.addPaymentPlan ()
    },
    //撤销审批提示
    repealApp(){
      this.$confirm('此操作将撤销审批, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.updateApproval()
        this.$message({
          type: 'success',
          message: '撤销成功!'
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消撤销'
        })
      })
    },
    //撤销审批
    updateApproval(){
      //修改审批记录表
      this.approvalRecord.approvalRecordTime = '1'
      this.approvalRecord.approvalRecordOper = '撤销'
      this.approvalRecord.employeeByApprovalEmpId = this.emp
      this.saveAppRecord()
      //修改审批表 审批状态1 1待审批 2同意 3否决 4撤销 5重审
      this.approval.approvalStatus = 4
      this.saveApp()
      this.$message({
        message: '撤销成功',
        type: 'success'
      })
      //修改报价单 审批状态为待申请  0待申请 1待审批 2同意 3否决
      this.paymentPlan.paymentPlanAppStatus  = 0
      this.addPaymentPlan ()
    },
    // 审批axois
    saveApp(){
      console.log(this.approval.approvalId)
      this.$axios.post('http://localhost:8088/save-approval',
        {
          approvalId:this.approval.approvalId,
          approvalContent:this.approval.approvalContent,
          approvalTheme:this.approval.approvalTheme,
          approvalStay:this.approval.approvalStay,
          approvalStatus: this.approval.approvalStatus,
          approvalClassify:this.approval.approvalClassify,
          approvalOperation:this.approval.approvalOperation,
          approvalDate:this.approval.approvalDate,
          approvalTime:this.approval.approvalTime,
          employeeByApplicantEmpId:this.approval.employeeByApplicantEmpId,
          employeeByApprovalEmpId:this.approval.employeeByApprovalEmpId,
          paymentPlanByPaymentPlanId:this.approval.paymentPlanByPaymentPlanId,
        })
        .then(v => {
          this.innerDialog = false
          this.approval = {
            approvalId:0,
            approvalTheme:'',
            approvalStay:'',
            approvalStatus: 0,
            approvalClassify:0,
            approvalOperation:'',
            approvalDate:'',
            approvalTime:'',
            paymentPlanByPaymentPlanId:'',
            employeeByApplicantEmpId:'',
            employeeByApprovalEmpId:null
          }
        })
        .catch(function (v) {})
    },
    // 审批记录axois
    saveAppRecord(){
      this.$axios.post('http://localhost:8088/save-app-record',
        {
          approvalRecordId:this.approvalRecord.approvalRecordId,
          approvalRecordOper:this.approvalRecord.approvalRecordOper,
          approvalRecordNote:this.approvalRecord.approvalRecordNote,
          employeeByApprovalEmpId:this.approvalRecord.employeeByApprovalEmpId,
          employeeByApplicantEmpId:this.approvalRecord.employeeByApplicantEmpId,
          approvalRecordDate:this.approvalRecord.approvalRecordDate,
          approvalRecordTime:this.approvalRecord.approvalRecordTime,
          paymentPlanByPaymentPlanId: this.approvalRecord.paymentPlanByPaymentPlanId
        })
        .then(v => {
          this.approvalRecord = {
            approvalRecordId:0,
            approvalRecordTime:'',
            approvalRecordOper:'',
            approvalRecordNote:'',
            employeeByApplicantEmpId:'',
            employeeByApprovalEmpId:null,
            approvalRecordDate:'',
            paymentPlanByPaymentPlanId:''
          }
        })
        .catch(function (v) {})
    },
    // 关闭付款记录dialog事件
    closeDialogPayRecords(){
      this.$refs.payRecords.resetFields()
      this.paymentRecords = {
        paymentRecordsId:0,
        paymentRecordsPeriods:'',
        paymentRecordsDate:'',
        paymentRecordsAmount:'',
        paymentRecordsPayStyle:'',
        paymentRecordsWhetherTicket:'',
        paymentRecordsClassify:'',
        paymentRecordsNote:'',
        employeeByEmpId:'',
        customerByCustomerId:'',
        purchaseByPurchaseId:'',
        paymentPlanByPaymentPlanId:'',
        returnByReturnId:null
      }
    },
    //点击付款生成付款记录
    clickCreatePayRecords(val){
        this.dialogPay = true
        this.paymentRecords.paymentRecordsPeriods = this.paymentPlan.paymentPlanPeriods
        this.paymentRecords.paymentRecordsDate = this.addDate()
        this.paymentRecords.paymentRecordsAmount = this.paymentPlan.paymentPlanAmount
        this.paymentRecords.purchaseByPurchaseId = this.paymentPlan.purchaseByPurchaseId
        this.paymentRecords.employeeByEmpId = this.emp
        this.paymentRecords.customerByCustomerId = this.paymentPlan.customerByCustomerId
        this.paymentRecords.paymentPlanByPaymentPlanId = this.paymentPlan
        this.paymentRecords.paymentRecordsWhetherTicket = 1
    },
    // 生成/修改付款记录
    addPayRecords() {
      this.$refs.payRecords.validate((valid) => {
        if (valid) {
          // 修改付款计划状态
          this.paymentPlan.paymentPlanStatus = 2
          this.$axios.post('http://localhost:8088/save-pay-plan',this.paymentPlan)
            .then(v => {
              this.initData()
            })
            .catch(function (v) {
            })
          // 修改采购单已付金额
          this.purchase.purchasePaid = this.purchase.purchasePaid + this.paymentPlan.paymentPlanAmount
          this.addPurchase()
          // 生成付款纪录
          this.$axios.post('http://localhost:8088/save-pay-records',this.paymentRecords)
            .then(v => {
              this.dialogPay = false
            })
            .catch(function (v) {
            })
        } else {
          console.log('error submit!!');
          return false;
        }
      })

    },
    addPurchase() {
      if(this.purchase.customerByConCustomerId === ''){
        this.purchase.customerByConCustomerId = null
      }
      if(this.purchase.contractByContractId === ''){
        this.purchase.contractByContractId = null
      }
      this.$axios.post('http://localhost:8088/save-purchase',
        {
          purchaseId: this. purchase.purchaseId,
          purchaseTheme: this.purchase.purchaseTheme,
          purchaseNo: this.purchase.purchaseNo,
          purchaseDate: this.purchase.purchaseDate,
          purchasePredictDate: this.purchase.purchasePredictDate,
          purchaseStatus: this.purchase.purchaseStatus,
          purchaseSort: this.purchase.purchaseSort,
          purchaseAmount: this.purchase.purchaseAmount,
          purchaseNote: this. purchase.purchaseNote,
          purchaseContactName: this.purchase.purchaseContactName,
          purchaseBill: this.purchase.purchaseBill,
          purchasePaid: this.purchase.purchasePaid,
          purchaseAppStatus: this.purchase.purchaseAppStatus,
          purchaseReturn: this.purchase.purchaseReturn,
          customerByCustomerId: this.purchase.customerByCustomerId,
          employeeByEmpId: this.purchase.employeeByEmpId,
          customerByConCustomerId: this.purchase.customerByConCustomerId,
          contractByContractId: this.purchase.contractByContractId,
          employeeByAppEmpId: this.purchase.employeeByAppEmpId,
          warehouseByWarehouseId: this.purchase.warehouseByWarehouseId,
          productDetailsByPurchaseId: this.detailList
        })
        .then(v => {

        })
        .catch(function (v) {
        })

    },
    // 删除提示
    handleDelete (val) {
      this.$confirm('此操作将永久删除付款计划, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.deletePay()
        this.$message({
          type: 'success',
          message: '删除成功!'
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    // 删除axios
    deletePay(){
      let payId = this.$route.query.payId
      this.$axios.post('http://localhost:8088/delete-pay-plan', this.qs.stringify({payId: payId}))
        .then(v => {
          this.initData()
        })
        .catch(function (v) {})
    },
    // 获取当前日期
    addDate () {
      var date = new Date();
      var seperator1 = "-";
      var seperator2 = ":";
      var month = date.getMonth() + 1<10? "0"+(date.getMonth() + 1):date.getMonth() + 1;
      var strDate = date.getDate()<10? "0" + date.getDate():date.getDate();
      var currentdate = date.getFullYear() + seperator1  + month  + seperator1  + strDate
      return currentdate
    }
  },
  created() {
    this.loginEmp()
    this.initData()
    this.findApproval()
    this.findAppRecord()
    this.findAppRecordBy()
  },
  filters: {
    formatDate: function(time) {
      if(time!=null&&time!="")
      {
        var date = new Date(time);
        return formatTimeToStr(date, "yyyy-MM-dd hh:mm");
      }else{
        return "";
      }
    },
    formatDateJudge: function(time) {
      if(time != null && time != "")
      {
        let date = new Date(time);
        let currentDate = new Date()
        let seperator1 = "-";
        let month = currentDate.getMonth() + 1<10? "0"+(currentDate.getMonth() + 1):currentDate.getMonth() + 1;
        let strDate = currentDate.getDate()<10? "0" + currentDate.getDate():currentDate.getDate();
        let today = currentDate.getFullYear() + seperator1  + month  + seperator1  + strDate
        let todayTime = new Date(today)
        let yesterday = todayTime.setDate(todayTime.getDate() - 1)
        let beforeYesterday = todayTime.setDate(todayTime.getDate() - 1)
        let tomorrow = todayTime.setDate(todayTime.getDate() + 3)
        let afterTomorrow = todayTime.setDate(todayTime.getDate() + 1)
        todayTime.setDate(todayTime.getDate() - 2)
        if (date.getTime() === todayTime.getTime()){
          return '今天'
        }else if (date.getTime() ===  yesterday){
          return '昨天'
        }else if (date.getTime() ===  beforeYesterday){
          return '前天'
        }else if (date.getTime() ===  tomorrow){
          return '明天'
        }else if (date.getTime() ===  afterTomorrow){
          return '后天'
        }else {
          return time
        }
      }else{
        return "";
      }
    }
  }
}
</script>

<style>

</style>
